<template>
  <div>

<div v-for="(item,i) in list" :key="i">
     <el-descriptions class="margin-top" title="基础信息" :column="3" :size="size" v-show="notshow">
    <template slot="extra">
      <el-button type="primary" size="small" @click="submit">操作</el-button>
    </template>
    <el-descriptions-item label="用户名">{{item.name}}</el-descriptions-item>
    <el-descriptions-item label="性别">{{item.sex}}</el-descriptions-item>
    <el-descriptions-item label="居住地">{{item.addr}}</el-descriptions-item>
    <el-descriptions-item label="邮箱">{{item.email}}</el-descriptions-item>
    <el-descriptions-item label="职业">{{item.identity}}</el-descriptions-item>
    <el-descriptions-item label="备注">
      <el-tag size="small">离职</el-tag>
    </el-descriptions-item>
  </el-descriptions>
</div>

<div v-for="(item,i) in list1" :key="i">

     <el-descriptions class="margin-top" title="服务能力" :column="3" :size="size" v-show="notshow1">
    <template slot="extra">
      <el-button type="primary" size="small" @click="submit1">操作</el-button>
    </template>
    <el-descriptions-item label="服务能力">{{item.ability}}</el-descriptions-item>
    <el-descriptions-item label="技能">{{item.skil}}</el-descriptions-item>
    <el-descriptions-item label="薪资">{{item.pay}}</el-descriptions-item>
    <el-descriptions-item label="结算方式">{{item.close}}</el-descriptions-item>
    <el-descriptions-item label="工作方式">{{item.work}}</el-descriptions-item>
    <el-descriptions-item label="工作时间">{{item.worktime}}</el-descriptions-item>

    <el-descriptions-item label="备注">
      <el-tag size="small">离职</el-tag>
    </el-descriptions-item>
  </el-descriptions>
</div>

    <el-form ref="form" :model="form" label-width="80px" v-show="isshow">
  <el-form-item label="姓名">
    <el-input v-model="form.name"></el-input>
  </el-form-item>
  <el-form-item label="性别">
    <el-radio-group v-model="form.sex">
      <el-radio label="男"></el-radio>
      <el-radio label="女"></el-radio>
    </el-radio-group>
  </el-form-item>
   <el-form-item label="身份状态">
    <el-radio-group v-model="form.identity">
      <el-radio label="自由职业"></el-radio>
      <el-radio label="上班族"></el-radio>
      <el-radio label="学生"></el-radio>

    </el-radio-group>
  </el-form-item>

    <el-form-item label="所在地">
    <el-input v-model="form.addr"></el-input>
  </el-form-item>

  <el-form-item label="邮箱">
    <el-input v-model="form.email"></el-input>
  </el-form-item>
  <el-form-item>
    <el-button type="primary" @click="onSubmit">立即创建</el-button>
    <el-button>取消</el-button>
  </el-form-item>
</el-form>



 <el-form ref="form" :model="form1" label-width="80px" v-show="isshow1">
  <el-form-item label="服务能力">
    <el-input v-model="form1.ability"></el-input>
  </el-form-item>
  <el-form-item label="技能">
    <el-input v-model="form1.skil"></el-input>
  </el-form-item>
  <el-form-item label="薪资">
    <el-input v-model="form1.pay"></el-input>
  </el-form-item>0
  <el-form-item label="结算方式">
    <el-input v-model="form1.close"></el-input>
  </el-form-item>
  <el-form-item label="工作方式">
    <el-input v-model="form1.work"></el-input>
  </el-form-item>
    <el-form-item label="工作时间">
    <el-input v-model="form1.worktime"></el-input>
  </el-form-item>


  <el-form-item>
    <el-button type="primary" @click="onSubmit1">立即创建</el-button>
    <el-button>取消</el-button>
  </el-form-item>
</el-form>
  </div>
</template>

<script>
export default {
     data() {
      return {
        form: {
          name: '',
          sex:'',
          identity:'',
          addr:'',
          email:'',
          userid:localStorage.getItem('userid')
        },
        list:[],
        isshow:false,
        notshow:true,

        form1: {
          abukuty: '',
          skil:'',
          pay:'',
          close:'',
          work:'',
          worktime:'',
          userid:localStorage.getItem('userid')
        },
        list1:[],
        isshow1:false,
        notshow1:true
      }
    },
    methods: {
      onSubmit() {
        this.axios.post('/setbasic',this.form)
        .then(res=>{
            alert(res.data.msg)
            this.isshow=false
            this.notshow=true
        })

        console.log('submit!');
      },
      submit(){
        this.isshow=true
        this.notshow=false
      },
      getbasic(){
        this.axios.get('getbasic?userid='+this.form.userid)
        .then(res=>{
            this.list = res.data.list
        })
      },

  onSubmit1() {
        this.axios.post('/setserve',this.form1)
        .then(res=>{
            alert(res.data.msg)
            this.isshow1=false
            this.notshow1=true
        })
        console.log('submit!');
      },
      submit1(){
        this.isshow1=true
        this.notshow1=false

      },
      getserve(){
        this.axios.get('getserve?userid='+this.form.userid)
        .then(res=>{
            this.list1 = res.data.list
        })
      }

    },
    mounted(){
        this.getbasic()
        this.getserve()
    }
}
</script>

<style>

</style>


Basic